<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<!--头部-->
<head th:fragment="head">
    <meta charset="utf-8" />
    <link rel="apple-touch-icon" sizes="76x76" href="../assets/img/apple-icon.png">
    <link rel="icon" type="image/png" href="../assets/img/favicon.png">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

    <title>
        后台管理
    </title>
    <meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no' name='viewport' />
    <!--     Fonts and icons     -->
    <link href="https://fonts.googleapis.com/css?family=Montserrat:400,700,200" rel="stylesheet" />
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css" rel="stylesheet">
    <!-- CSS Files -->
    <link href="/pages/admin/assets/css/bootstrap.min.css" rel="stylesheet" />
    <link href="/pages/admin/assets/css/paper-dashboard.css?v=2.0.1" rel="stylesheet" />
    <!-- CSS Just for demo purpose, don't include it in your project -->
    <link href="/pages/admin/assets/demo/demo.css" rel="stylesheet" />
<!--    <style>-->
<!--        html { overflow:hidden; }-->
<!--    </style>-->
</head>

<!--导航栏-->
<div th:fragment="sidebar" class="sidebar" data-color="white" data-active-color="danger" >
    <div class="logo">
        <a href="" class="simple-text logo-mini">
            <div class="logo-image-small">
                <img src="/pages/admin/assets/img/logo-small.png" alt="头像">
            </div>
            <!-- <p>CT</p> -->
        </a>
        <a href="" class="simple-text logo-normal">
            <span th:text="user.username" >管理员名字</span>
        </a>
    </div>
    <div class="sidebar-wrapper">
        <ul class="nav" id="nav">
            <li th:class="${active=='dashbord'}?'active':''">
                <a href="/wallpaper/main">
                    <i class="nc-icon nc-sound-wave"></i>
                    <p>统计</p>
                </a>
            </li>
            <li th:class="${active=='user'}?'active':''">
                <a href="/user/userpage">
                    <i class="nc-icon nc-single-02"></i>
                    <p>用户管理</p>
                </a>
            </li>
            <li th:class="${active=='wallpaper'}?'active':''">
                <a href="/wallpaper/wallpaperpage">
                    <i class="nc-icon nc-palette"></i>
                    <p>壁纸管理</p>
                </a>
            </li>
            <li th:class="${active=='wallpaper_examine'}?'active':''">
            <a href="/wallpaper/wallpaperpageBystate">
                    <i class="nc-icon nc-alert-circle-i"></i>
                    <p>壁纸审核</p>
                </a>
            </li>
            <li th:class="${active=='message'}?'active':''">
                <a href="/wallpaper/message">
                    <i class="nc-icon nc-email-85"></i>
                    <p>消息</p>
                </a>
            </li>
        </ul>
    </div>
</div>


<!-- Navbar -->
<nav th:fragment="navbar" class="navbar navbar-expand-lg navbar-absolute fixed-top navbar-transparent">
    <div class="container-fluid">
        <div class="navbar-wrapper">
            <div class="navbar-toggle">
                <button type="button" class="navbar-toggler">
                    <span class="navbar-toggler-bar bar1"></span>
                    <span class="navbar-toggler-bar bar2"></span>
                    <span class="navbar-toggler-bar bar3"></span>
                </button>
            </div>
            <a class="navbar-brand" href="#">WALLPAPER 后台管理</a>
        </div>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navigation" aria-controls="navigation-index" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-bar navbar-kebab"></span>
            <span class="navbar-toggler-bar navbar-kebab"></span>
            <span class="navbar-toggler-bar navbar-kebab"></span>
        </button>
        <div class="collapse navbar-collapse justify-content-end" id="navigation">
            <ul class="navbar-nav">
                <li class="nav-item">
                    <a class="nav-link btn-rotate" th:href="@{'/user/loginout'}">
                        <i class="nc-icon nc-user-run"></i>
                        <p>
                            注销
                        </p>
                    </a>
                </li>
            </ul>
        </div>
    </div>
</nav>

<!--底部-->
<footer th:fragment="footer" class="footer footer-black  footer-white ">
    <div class="container-fluid">
        <div class="row">
            <nav class="footer-nav">
                <ul>
                    <li><a href="https://www.creative-tim.com" target="_blank">Creative Tim</a></li>
                    <li><a href="https://www.creative-tim.com/blog" target="_blank">Blog</a></li>
                    <li><a href="https://www.creative-tim.com/license" target="_blank">Licenses</a></li>
                </ul>
            </nav>
            <div class="credits ml-auto">
              <span class="copyright">
                © <script>
                  document.write(new Date().getFullYear())
                </script>, made with <i class="fa fa-heart heart"></i> by Creative Tim
              </span>
            </div>
        </div>
    </div>
</footer>

<!--script-->
<div th:fragment="script">
    <!--   Core JS Files   -->
    <script src="/pages/admin/assets/js/core/jquery.min.js"></script>
    <script src="/pages/admin/assets/js/core/popper.min.js"></script>
    <script src="/pages/admin/assets/js/core/bootstrap.min.js"></script>
    <script src="/pages/admin/assets/js/plugins/perfect-scrollbar.jquery.min.js"></script>
    <!--  Google Maps Plugin    -->
    <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script>
    <!-- Chart JS -->
    <script src="/pages/admin/assets/js/plugins/chartjs.min.js"></script>
    <!--  Notifications Plugin    -->
    <script src="/pages/admin/assets/js/plugins/bootstrap-notify.js"></script>
    <!-- Control Center for Now Ui Dashboard: parallax effects, scripts for the example pages etc -->
    <!--  <script src="/pages/admin/assets/js/paper-dashboard.min.js" ></script>&lt;!&ndash; Paper Dashboard DEMO methods, don't include it in your project! &ndash;&gt;-->
    <script src="/pages/admin/assets/demo/demo.js"></script>
    <script src="/static/js/jquery.form.js"></script>
    <script>
        $(document).ready(function() {
            // Javascript method's body can be found in assets/assets-for-demo/js/demo.js
            demo.initChartsPages();
        });
    </script>
</div>
</html>